<template>
  <div class="content">
    <Col span="6">
    <div>
      <indexh></indexh>
    </div>
    </Col>
    <Col span="18">
    <Alert show-icon>
      天气现象表&nbsp;&nbsp;
      <Tag color="green">下载</Tag>
      <Icon type="ios-cloud-outline" slot="icon"></Icon>
      <template slot="desc">提供天气现象一览表，以及对应的天气图标。</template>
    </Alert>
    <Alert show-icon>
      城市编码表&nbsp;&nbsp;
      <Tag color="green">下载</Tag>
      <Icon type="ios-world-outline" slot="icon"></Icon>
      <template slot="desc">提供2565个城市对应的城市编码，以便调用环境云提供的各类数据接口。</template>
    </Alert>
    <div class="api">
      <p class="api-title">API Version 2.0 文档</p>
      <div class="curl">
        <Tag color="red">基础URL</Tag>
        <span>http://service.envicloud.cn:8082</span>
      </div>
      <Table stripe :columns="columns1" :data="data1"></Table>
    </div>
    <div class="api-all-content">
      <WeatherContent></WeatherContent>
    </div>
    </Col>
  </div>
</template>

<style>
  .content {
    margin-top: 40px;
  }

  .api {
    margin-top: 35px;
  }

  .api-title {
    font-size: 16px;
    padding-left: 10px;
    border-left: 3px solid #19BE6B;
  }

  .api-all-content {
    margin-top: 35px;
  }

  .api-content {
    margin-top: 20px;
    padding-left: 24px;
  }

  #collapse {
    border: 0;
  }

</style>
<script>
  import indexh from "../components/indexH.vue";
  import WeatherContent from "../components/WeatherContent.vue"
  export default {
    name: "Home",
    components: {
      indexh,
      WeatherContent,
    },
    data() {
      return {
        columns1: [{
            title: '结果码',
            key: 'res'
          },
          {
            title: '含义',
            key: 'mean'
          },
        ],
        data1: [{
            res: 200,
            mean: '成功',
          }, {
            res: 201,
            mean: '内部错误',
          }, {
            res: 202,
            mean: '结果集为空',
          }, {
            res: 203,
            mean: '参数错误',
          },

        ]
      }
    }
  };

</script>
